<template>
  <div>
    <el-dialog
      :title="tittle"
      :close-on-click-modal="false"
      append-to-body
      :visible.sync="visible"
      class="jsbos-dialog jsbos-dialog_center"
      lock-scroll
      width="800px"
    >
      <component
        :is="currentView"
        :data="dataTransfer"
        @close="goBack"
        ref="form"
        @eventReceiver="eventReceiver"
        @setLoad="setLoad"
        @setCandidateLoad="setCandidateLoad"
        @setPageLoad="setPageLoad"
      />
      <div slot="footer" class="dialog-footer" v-if="setting.type != 'detail'">
        <!-- this.buttonFlag   控制详情页时隐藏按钮 -->
        <el-button @click="visible = false" v-if="this.buttonFlag"
          >取 消</el-button
        >
        <el-button
          type="primary"
          @click="eventLauncher('save')"
          :disabled="allBtnDisabled"
          v-if="this.buttonFlag"
          >确 定</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
import Comment from "./Comment";
import RecordSummary from "./RecordSummary";
import CandidateForm from "./CandidateForm";
import { isEmpty } from "@/utils/isEmpty";
export default {
  components: {
    Comment,
    RecordSummary,
    CandidateForm,
  },
  props: {
    data: {
      type: Object,
      required: false,
    },
  },
  data() {
    return {
      buttonFlag: true, //控制详情页时隐藏按钮
      allBtnDisabled: false,
      title: "",
      tittle: "",
      dataTransfer: this.data,
      assignVisible: false,
      assignForm: {
        nodeCode: "",
        freeApproverUserId: "",
      },
      currentView: "",
      formData: {},
      setting: {},
      flowTaskInfo: {},
      properties: {},
      endTime: 0,
      visible: false,
      reason: "",
      handleId: "",
      activeTab: "0",
      loading: false,
      btnLoading: false,
      candidateLoading: false,
      candidateVisible: false,
      candidateList: [],
      candidateForm: {
        candidateList: [],
      },
      eventType: "",
      copyIds: [],
      fullName: "",
      thisStep: "",
      allBtnDisabled: false,
    };
  },
  created() {},
  computed: {},
  watch: {
    activeTab(val) {
      if (val === "comment") {
        this.$refs.comment && this.$refs.comment.init();
      }
      if (val === "recordSummary") {
        this.$refs.recordSummary && this.$refs.recordSummary.init();
      }
    },
  },
  methods: {
    goBack(isRefresh) {
      this.$emit("close", isRefresh);
    },
    init(data) {
      if (!isEmpty(data.buttonFlag)) {
        this.buttonFlag = false;
      } else {
        this.buttonFlag = true;
      }
      // console.log(this.buttonFlag);
      this.tittle = data.tittle;
      this.activeTab = "0";
      this.setting = data;
      this.getEngineInfo(data);
    },
    getEngineInfo(data) {
      this.visible = true;
      var res = {
        formUrl: data.formUrl,
      };
      const formUrl = res.formUrl.replace(/\s*/g, "");
      console.log("res.data.formUrl" + res.formUrl);
      this.currentView = (resolve) => require([`@/views/${formUrl}`], resolve);

      setTimeout(() => {
        this.$nextTick(() => {
          this.$refs.form && this.$refs.form.init(data);

          if (data.type == "detail") {
            this.$refs.form && this.$refs.form.setType(true);
          }
        });
      }, 500);
    },
    eventLauncher(eventType) {
      this.allBtnDisabled = true;
      setTimeout(() => {
        this.allBtnDisabled = false;
      }, 1500);
      this.btnLoading = true;
      this.$refs.form && this.$refs.form.dataFormSubmit(eventType);

      this.btnLoading = false;
    },
    eventReceiver(formData, eventType) {
      this.formData = formData;
      this.formData.flowId = this.setting.flowId;
      this.eventType = eventType;
      if (eventType === "save" || eventType === "submit") {
      }
      if (eventType === "saveAudit") {
        return this.saveAudit();
      }
      if (eventType === "audit" || eventType === "reject") {
        this.handleId = "";
        this.reason = "";
        this.copyIds = [];
        this.handleReset();
        if (eventType === "reject") return (this.visible = true);
        this.candidateLoading = true;
      }
    },
    setPageLoad(val) {
      this.loading = !!val;
    },
    setCandidateLoad(val) {
      this.candidateLoading = !!val;
    },
    setLoad(val) {
      this.btnLoading = !!val;
    },
  },
};
</script>
<style lang="scss" scoped>
.flow-form-main {
  el_tabs {
    overflow: hidden;
  }
}
</style>
